<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<style>
			*{
				margin: 0;
				padding: 0;
			}
			.bigbox{
				display: flex;
				flex-wrap: wrap;
				justify-content: space-around;
				/* 项目交叉轴上的对齐方式： */
				align-items: center;
				/* 多条轴线的对齐方式：
				 flex-start:沿交叉轴的开始位置
				 flex-ent：沿交叉轴的结束位置
				 center：居中
				 space-between：两端对齐
				 space-around：拉手对齐
				 stretch：默认值
				 */
				align-content:center;
				width: 1300px;
				height: 700px;
				border: 1px solid gray;
				margin: auto;
			}
			.bigbox div{
				width: 200px;
				height: 200px;
				border: 1px solid red;
				font-size: 34px;
				text-align: center;
				line-height: 200px;
			}
		</style>
	</head>
	<body>
		<!-- flex布局：
		display：flex 
		-->
		<div class="bigbox">
			<div>1</div>
			<div>2</div>
			<div>3</div>
			<div>4</div>
			<div>5</div>
			<div>6</div>
		</div>
	</body>
</html>
